v3.9.0 to v3.10.0

AUTOMATIC MIGRATION

1. Update Visual Studio to the latest version ((Migration tested with Visual Studio 2022 version 17.10.3)). On Visual Studio Code, install extension ESLint and Prettier - Code formatter
2. Update Angular cli at version 17 run in powershell:

npm uninstall -g angular/cli @angular/cli
npm i -g @angular/cli@17

3. Use the BIAToolKit to migrate the project

4. Delete all package-lock.json and node_modules folder

5. Manage the conflicts (2 solutions)

   1. In BIAToolKit click on "4 - merge Rejected" and search <<<<< in all files.
   • Resolve the conflicts manually.
   2. Analyze the .rej file (search "diff a/" in VS code) that have been created in your project folder
   • Apply manually the change.

6. Change source path and run the script V3.9.0_to_V3.10.0_Replacement.ps1

7. Apply other manual step (describe below) at the end if all is ok, you can remove the .rej files (during the process they can be useful to resolve build problems)

MANUAL STEPS

FRONT

Warning : A bug exists in 3.9.0 and 3.10.0 that prevents to finish the authentication process and stops all call to the api by staying in the waitLogin function of the http interceptor. It happens in very specific cases where a call to the backend that needs a re-authentication (first call or needing token refresh) is cancelled for a reason or another (launching the same http request twice before the first is finished for example). To prevent this bug you can modify the token.interceptor.ts this way :

Replace login and waitLogin functions like this :

  protected login(
    request: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    this.isRefreshing = true;
    this.authService.logout();
    console.info('Login start from interceptor.');
    const obs$: Observable<HttpEvent<any>> = this.authService.login().pipe(
      switchMap((authInfo: AuthInfo) => {
        console.info('Login end from interceptor.');
        this.isRefreshing = false;
        return next.handle(this.addToken(request, authInfo.token));
      }),
      finalize(() => {
        // Requests can be canceled while login is ongoing.
        // If it happens, we must set the information that the refresh is over to
        // either let another request refresh the token
        // or inform that this request has correctly refreshed the token despite the cancelling
        if (this.isRefreshing) {
          this.isRefreshing = false;
          console.info('Login end from interceptor from finalize.');
        }
      })
    );

    if (this.appSettingsService.appSettings?.keycloak?.isActive === true) {
      return from([this.keycloakService.isLoggedIn()]).pipe(
        filter(x => x === true),
        switchMap(() => obs$)
      );
    } else {
      return obs$;
    }
  }

  protected waitLogin(
    request: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    return this.authService.authInfo$.pipe(
      filter(authInfo => authInfo.token !== ''),
      take(1),
      switchMap(authInfo => {
        return next.handle(
          this.addToken(request, authInfo ? authInfo.token : '')
        );
      })
    );
  }

The correction is included in 4.0.0 and higher versions.

1. This version activates the immutability of NGRX stores. It means you can't modify directly an object that comes from the store. You first need to make a copy of it. No error will be shown at compilation if you do, but only at runtime : you should check every part of your application using ngrx select or sending object to api to verify you don't update that object. If you do, first make a copy of this object before modifying it (with clone function). For arrays of object you can also reconstruct your array (creating a new array) with : myArray = [...myArray];
2. This version activates the strictTemplates for projects. This will give VSCode more functionnalities, enabling the navigation from html to ts references. It forces html to respect every types. For example, if a type is nullable, you won't be able to pass it to a non nullable input in a component. Migration should already fix a large number of typing errors but you might have to fix some more :

• | async instructions can return null so you have to fix it when the input doesn't accept nullable, either by accepting null in @Input or setting a default value with ?? operator or by not displaying component while the value is null with a *ngIf directive
  • You can use that method to replace the errors :
    • In VSCode, open replace in all project with Ctrl+Shift+H
    • In search, paste : \[(?!\bngSwitch\b)(?!\bngIf\b)(?!\bappSettings\b)([A-z]+)\]="(([A-z]*\.)*([A-z]+)\$ \| async)"
    • In replace value, paste : *ngIf="$2; let $4" [$1]="$4"
    • Activate regex mode with the top right icon Use Regular Expression (shortcut Alt+R)
    • Check every occurence of the result and :
      • if there is an error because of a single object with input that can't be null, check if your input type should be typed with | null and if not replace that result with the replace tool
      • if there is an error because of an array of objects with input that can't be null, set a default value to the value passed to the input with (myObservable$ | async) ?? []
      • if there is an error because of a primitive value with input that can't be null, set a default value with (myObservable$ | async) ?? 0 for number, etc.
• if you want to pass a value to an input that is not string, you have to use the [myInput] instead of myInput. Example : <my-component showLoader="true"> has to be replaced by <my-component [showLoader]="true"> You can always deactivate strictTemplates in the tsconfig.json (though unadvisable).

3. The HTML templates of BiaTableComponent and BiaCalcTableComponent uses the property selectedElements to set the selection input property of p-table component. Ensure that any of your own table component that extends the BiaTableComponent or BiaCalcTableComponent with a custom HTML template set the same input property of p-table component with the selectedElements property :

<p-table
  ...
  [(selection)]="selectedElements"
  ...>
</p-table>

BACK

1. Tout ce qui concerne UserProfile été supprimé du framework dans cette version. Cette partie ne devrait pas être utilisée et peut être supprimée de vos applications si vous y faites référence.
2. The NotificationDomainService has been moved to NotificationAppService in application layer. If you had specific code in your NotificationDomainService, move it manually to the NotificationAppService.

BUILD

DEPLOY